<template>
  <div class="infectious-order-list-head">
    <head-info>
      <section class="infection" @click="GoToTransferOrderList">
        <i class="iconfont">&#xe648;</i>
        <span>普通转运单</span>
      </section>
    </head-info>
  </div>
</template>

<script>
import HeadInfo from "./HeadInfo";
export default {
  name: "InfectiousOrderListHead",
  components: {
    HeadInfo,
  },
  methods: {
    GoToTransferOrderList() {
      this.$router.push({ name: "TransferOrderList" });
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.infectious-order-list-head {
  background: url("../assets/image/headbg.png") no-repeat;
  background-size: 100% 100%;
  height: 10%;
}
.infectious-order-list-head >>> .head-info {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  position: relative;
  height: 100%;
}
.infection{
  margin-right: 10px;
  cursor: pointer;
}
</style>